<template>
	<div class="contents">
		<van-nav-bar
		  title="购物车"
		  left-text="返回"
		  left-arrow
		  @click-left="onClickLeft"
		/>
		<div class="content">
			<van-row class="cart-mt">
				<van-col span="3">
					<div class="checkcol">
						<van-checkbox v-model="checked"></van-checkbox>
					</div>
				</van-col>
				<van-col span="21">
					<van-card
						num="2"
						tag="标签"
						price="2.00"
						desc="描述信息"  
						title="商品标题"
						:thumb="imageURL"
						origin-price="10.00"
						class="stepHeight"
					>
						<div slot="footer">
							<van-stepper
								v-model="value"
								integer
								:min="5"
								:max="40"
								:step="2"
							class="stepBig"/>
						</div>
					</van-card>
				</van-col>
			</van-row>
			<van-row class="cart-mt">
				<van-col span="3">
					<div class="checkcol">
						<van-checkbox v-model="checked"></van-checkbox>
					</div>
				</van-col>
				<van-col span="21">
					<van-card
						num="2"
						tag="标签"
						price="2.00"
						desc="描述信息"  
						title="商品标题"
						:thumb="imageURL"
						origin-price="10.00"
						class="stepHeight"
					>
						<div slot="footer">
							<van-stepper
								v-model="value"
								integer
								:min="5"
								:max="40"
								:step="2"
							class="stepBig"/>
						</div>
					</van-card>
				</van-col>
			</van-row>
			<van-submit-bar
				:price="3050"
				button-text="提交订单"
				@submit="onSubmit"
			>
				<van-checkbox v-model="checked" class="suball">全选</van-checkbox>
<!-- 				<span slot="tip">
					你的收货地址不支持同城送, <span>修改地址</span>
				</span> -->
			</van-submit-bar>
		</div>
	</div>
</template>

<script>
import Vue from 'vue'
import { Row, Col, Cell, CellGroup, NavBar, Card,Stepper, SubmitBar, Checkbox, CheckboxGroup } from 'vant'
Vue.use(Row).use(Col).use(Cell).use(CellGroup).use(NavBar).use(Card).use(Stepper).use(SubmitBar).use(Checkbox).use(CheckboxGroup)
export default {
	data () {
		return {
			imageURL: require('../assets/img/build.png'),
			checked: true,
			value:""
		}
	},
	methods: {
		onClickLeft () {
			this.$router.go(-1)
		},
		onSubmit () {
			console.log(1)
		}
	}
}
</script>

<style lang="scss" scoped="scoped">
@import '@/lib/reset.scss';
.stepHeight {
	height: 1.05rem!important;
}
.checkcol {
	@include rect(100%, 1.05rem);
	@include flexbox();
	@include justify-content();
	@include align-items();
	background: #fafafa;
}
.checkclass {
	@include rect(.2rem, .2rem);
}
.cart-mt {
	margin-top: .1rem;
}
.suball {
	margin-left: .1rem;
}
</style>
